﻿<link href="#{skinPath}?v=#{cssVersion}" rel="stylesheet" type="text/css" />
<link href="~css/wojilu.app.content.admin.css?v=#{cssVersion}" rel="stylesheet" type="text/css" />    

<style>

.adminRow { box-shadow:0px 0px 15px #ddd; margin-bottom:15px !important; border-width:3px !important;;}
.moveRow { cursor:pointer;}

#portalAdminNav {width:100%;font-weight:normal; margin:auto; }
#portalAdminNav td { padding:5px 5px;}
#portalAdminNav .otherTab,#portalAdminNavWrap {background:#eee;}
.dragged {	border:1px red dashed;}
.menuItems{ background:#fffbe2; }

.adminSection { box-shadow:1px 2px 10px #ddd; }

#{app.Style}
#{app.SkinStyle}

</style>

<style>
.frmUpdate { padding:5px 30px 5px 30px;}
</style>


<div class="tabMain" style="width:98%;margin:auto; border-left:0px; border-bottom:0px; border-right:0px; background:#fff;padding:10px 0px 30px 0px;">
<div id="adminPortalContainer" style="margin:auto; ">

<div id="sectionContainer" target="#{layoutSaveUrl}">

    <table style="width:100%; margin-bottom:10px;">
        <tr>
            <td >
            <a href="#{setStyleUrl}" class="cmd frmBox" xwidth="800" title=":{setPageStyle}"><img src="~img/arrowRight.gif"/>:{setPageStyle}</a>
            <span class="frmUpdate cmd left10" href="#{skinLink}" loadTo="skinWrap">选择皮肤</span>

            <!-- BEGIN export -->
            <a href="#{lnkExport}" class="frmBox left20 cmd" title="导出主题"><img src="~img/right.gif"/> 将当前布局导出为主题，方便复用</a><!-- END export -->
            </td>

            <td style="text-align:right; width:130px;">
                <span class="menuMore cmd" style="padding-left:8px;" id="addLayout" list="addLayoutMenu">:{moreRowOp} <img src="~img/down.gif"/>
	            <ul class="menuItems" id="addLayoutMenu">
		            <li><a href="#{addRow2Url}" class="frmBox" title=":{addRow2}"><img src="~img/add.gif"/> :{addRow2}</a> </li>
		            <li><a href="#{addRow1Url}" class="frmBox" title=":{addRow1}"><img src="~img/add.gif"/> :{addRow1}</a> </li>
		            <li><a href="#{addRow3Url}" class="frmBox" title=":{addRow3}"><img src="~img/add.gif"/> :{addRow3}</a></li>
		            <li><a href="#{addRow4Url}" class="frmBox" title=":{addRow4}"><img src="~img/add.gif"/> :{addRow4}</a></li>
		            <li><a href="#{addRow5Url}" class="frmBox" title=":{addRow5}"><img src="~img/add.gif"/> :{addRow5}</a></li>
		            <li><a href="#{addRow6Url}" class="frmBox" title=":{addRow6}"><img src="~img/add.gif"/> :{addRow6}</a></li>
	            </ul>		        
                </span>            
            </td>        
        </tr>        
    </table>
    
    <div id="skinWrap" style="display:none;"></div>

	<!-- BEGIN rowList -->
	
	<table id="row#{row.No}" class="adminRow" cellpadding="0" cellspacing="0" style="border-radius:4px; border:1px #ccc solid;">
		<tr class="rowTitle" style="">
			<td colspan="#{row.ColumnCount}" class="adminRowTitle" style="border-bottom:0px;">
			<table style="width:100%; "><tr><td>
			    <span  class="rowNumber" style="color:#aaa;">
			        <a href="#{row.EditUILink}" class="frmBox"  xwidth="680" title=":{setRowStyle}"><img src="~img/image.gif"/> #{row.No} </a>
			    </span>
			</td>
			<td style="text-align:right; color:#aaa;">
			<span href="#{row.RowUpUrl}" class="moveRow hide right10" title="上移本布局行"><img src="~img/s/upload.png" />上移</span>
			<span href="#{row.RowDownUrl}" class="moveRow hide" title="下移本布局行"><img src="~img/s/download.png" />下移</span>
			<a class="frmBox left10" href="#{row.DeleteUrl}" style="color:#aaa;"><img src="~img/delete.gif"/> :{deleteRow}</a></td></tr>
			</table>
			</td>
		</tr>
		
		<tr class="rowBody">
			<!-- BEGIN columnList -->
			<td id="#{column.Id}" class="adminColumn" style="padding:2px;">
				<ul class="columnTitle" style="border-radius:4px; border:0px; ">
					<li style="float:left; color:#aaa; vertical-align:middle;">					    
					    <a href="#{column.EditUILink}" class="frmBox" xwidth="680" title=":{setColumnStyle}">
					        <img class="dropArrow" src="~img/image.gif"/>
                            #{column.Name}
					    </a>
					</li>
					<li style="float:left;" class="menuMore left10" id="colAdmin#{column.Id}" list="sectionAdder#{column.Id}"><img src="~img/add.gif"/> <span style="color:#aaa;">:{addSection}</span>
					    <ul class="menuItems" id="sectionAdder#{column.Id}" style="width:300px;">
						    <li>
						        <a href="#{column.AddModuleUrl}" class="frmBox strong" xwidth="800" title=" :{addContentSection}"><img src="~img/add.gif"/> :{addContentSection}</a>
							    <span class="note">(:{oneStep})</span>
							    <div class="note" style="padding:0px 10px 10px 5px">:{contentSectionTip}</div>
						    </li>
						    <li style="padding-right:10px;">
						        <a href="#{column.AddAutoSection}" class="frmBox strong" xwidth="800" title=" :{addMashupSection}"><img src="~img/add.gif"/> :{addMashupSection}</a>
							    <span class="note">(:{threeStep})</span>
							    <div class="note" style="padding:0px 10px 10px 5px">:{mashupSectionTip}</div>
						    </li>
						    <li>
							    <a href="#{column.AddFeed}" class="frmBox strong" xwidth="800" title=":{addRss}"><img src="~img/add.gif"/> :{addRss}</a>
							    <span class="note">(:{oneStep})</span>
							    <div class="note" style="padding:0px 10px 10px 5px">:{rssSectionTip}</div>
						    </li>
					    </ul>
					</li>			
				</ul>
				<div class="clear"></div>
				
				<!-- BEGIN sectionList -->
				<table id="section#{section.Id}" border="0" class="adminSection" combineIds="#{section.CombineIds}" cellpadding="0" cellspacing="0">
					<tr>
						<td class="adminSectionTitle">

						    <table class="adminSectionTitleInternal" cellpadding="0" cellspacing="0" border="0" style="width:100%; "><tr>
							<td style="font-weight:bold;width:99%;cursor:move;" class="sectionTitleText" id="sectionTitleText#{section.Id}">
							    <div class="sectionTitleTab" contentId="sectionContentText#{section.Id}" style="cursor:move;"> #{section.Title}</div>
							</td>
							<td style="width:1%;">
							
							<div style="" class="sectionAdmin">
								<span class="menuMore" id="sectionAdmin#{section.Id}" list="sectionAdminMenu#{section.Id}">
								<span class="hide">_{admin}</span>
								<img src="~img/options.gif" class="right10" /> 
								<img src="~img/down.gif" class="hide"/>
								    <ul class="menuItems sectionAdminMenus" id="sectionAdminMenu#{section.Id}" style="text-align:left;width:180px;">
								    <!-- BEGIN links -->
								    <li><a href="#{setting.Url}" class="frmBox" xwidth="750" xheight="150" title="#{settting.Name}:#{section.Title}"><img src="~img/tools.gif" /> #{settting.Name}</a></li>
								    <!-- END links -->
								    <li style="margin-top:5px;border-top:1px #ccc dotted;"><a href="#{section.EditUILink}" class="frmBox" xwidth="650" title=":{editStyleSection}"><img src="~img/image.gif" /> :{editStyleSection}</a></li>
								    <li><a href="#{section.EditTitleUILink}" class="frmBox" xwidth="680" title=":{editStyleTitle}"><img src="~img/image.gif" /> :{editStyleTitle}</a></li>
								    <li><a href="#{section.EditContentUILink}" class="frmBox" xwidth="680" title=":{editStyleContent}"><img src="~img/image.gif" /> :{editStyleContent}</a></li>
								    <li><a href="#{section.EditEffectLink}" class="frmBox" xwidth="680" title=":{editEffect}"><img src="~img/refresh.gif" /> :{editEffect}</a></li>
								    <li style="margin-top:5px;border-top:1px #ccc dotted;"><a href="#{section.DeleteUrl}" class="deleteCmd"><img src="~img/delete.gif" /> :{deleteSection}</a></li>
								    <!-- BEGIN combineSection -->
								    <li><a href="#{section.CombineUrl}" class="frmBox" xwidth="350" title=":{combineSection}"><img src="~img/merge.gif" /> :{combineSection}</a></li>
								    <!-- END combineSection -->
								    <!-- BEGIN removeSections -->
								    <li><a href="#{r.RemoveLink}" class="frmBox">:{removeSection}:#{r.Name}</a></li>
								    <!-- END removeSections -->
								    </ul>								

								</span>
							
							</div>
							</td>
							</tr>
							</table>

						</td>
					</tr>
					
					<tr><td class="sectionContent">
					    <div class="sectionContentText" id="sectionContentText#{section.Id}">#{section.Content}</div>
					</td></tr>

				</table>
				<!-- END sectionList -->
			
			</td>
			<!-- END columnList -->

		</tr>
	
	</table>
	
	<!-- END rowList -->

</div>


</div>
</div>


<script>
    _run(function () {

        wojilu.ui.slider();
        wojilu.ui.frmUpdate();

        require(['wojilu.app.content.admin']);

        var adminSidebar = $('#sidebar');

        $('#toggleSidebar').click(function () {

            adminSidebar.toggle();

            var isHide = (adminSidebar.css('display') == 'none');

            if (isHide) {
                $(this).html('<img src="~img/left.gif"/> :{showSidebar}');
            }
            else {
                $(this).html('<img src="~img/close.gif"/> :{closeSidebar}');
            }

        });
        

        $('.binderSectionBody a').each(function () {
            $(this).attr('target', '_blank');
        });

        $('.sectionAdminMenus li a').bind("mousedown", function (e) {
            e.stopPropagation();
        });

        $('.moveRow').each(function () {
            if ($(this).attr('href') != '#') {
                $(this).show();
            }
        });

        $('.moveRow').click(function () {
            var saveUrl = $(this).attr('href');
            if (saveUrl == '#') return false;
            $.post(saveUrl.toAjax(), function (data) {
                if ('ok' == data) {
                    wojilu.tool.reloadPage();
                }
                else {
                    alert(data);
                }
            });
            return false;
        });


    });
</script>